<div class="febs-container">
    <div class="febs-component-body" id="febs-common-role" lay-title="角色选择">
        <div class="febs-body-search">
            <form class="layui-form layui-table-form" lay-filter="role-table-form" id="role-table-form">
                <div class="layui-card">
                    <div class="layui-card-body">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label layui-form-label-sm">角色名称</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="roleName" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <div id="query" class="layui-btn">
                                    <em class="layui-icon">&#xe615;</em> 查询
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="febs-table-full">
            <div class="layui-card febs-body-table">
                <div class="layui-card-body">
                    <table lay-filter="roleTable" lay-data="{id: 'roleTable'}"></table>
                </div>
            </div>
        </div>
    </div>
</div>

<script data-th-inline="none" type="text/javascript">
    layui.use(['dropdown', 'jquery', 'commonJS', 'form', 'table', 'febs'], function () {
        var $ = layui.jquery,
            febs = layui.febs,
            form = layui.form,
            commonJS = layui.commonJS,
            table = layui.table,
            $view = $('#febs-common-role'),
            $query = $view.find('#query'),
            $searchForm = $view.find('form'),
            tableIns;

        let tenantId = POPUP_DATA.tenantId
        let multiple = POPUP_DATA.multiple
        let selectList = POPUP_DATA.selectList
        form.render();
        form.render();

        initTable();

        function initTable() {
            tableIns = febs.table.init({
                elem: $view.find('table'),
                id: 'roleTable',
                skin: '',
                cols: [[
                    {type: multiple ? 'checkbox' : 'radio', width: 60},
                    {field: 'roleName', title: '角色名称', minWidth: 200},
                    {field: 'remark', title: '角色描述', minWidth: 280},
                    {field: 'createTime', title: '创建时间', width: 180},
                ]]
            });
            tableIns.reload({url: ctx + 'common/role/list', where: getQueryParams(), page: {curr: 1}});
        }

        window.getSelectData = function () {
            let selData = table.checkStatus("roleTable")
            let returnData = null
            if (selData.data.length > 0) {
                if (!multiple) {
                    returnData = {
                        roleId: selData.data[0].roleId,
                        roleName: selData.data[0].roleName,
                        tenantId: selData.data[0].tenantId,
                        tenantName: selData.data[0].tenantName,
                        utype: selData.data[0].utype
                    }
                    if (null != selectList && valueExists(selectList, "roleId", returnData.roleId)) {
                        returnData = null
                    }
                } else {
                    returnData = []
                    $.each(selData.data, function (index, item) {
                        let roleItem = null
                        roleItem = {
                            roleId: item.roleId,
                            roleName: item.roleName,
                            tenantId: item.tenantId,
                            tenantName: item.tenantName,
                            utype: item.utype
                        }
                        if (null != selectList && valueExists(selectList, "roleId", item.roleId)) {
                            roleItem = null
                        }
                        if (null != roleItem) {
                            returnData.push(roleItem)
                        }
                    })
                }
            }
            return returnData
        }

        $query.on('click', function () {
            tableIns.reload({where: getQueryParams(), page: {curr: 1}});
        });

        table.on('tool(roleTable)', function (obj) {
            var data = obj.data,
                layEvent = obj.event;
            if (layEvent === 'detail') {
                febs.modal.view('用户信息', 'system/webuser/detail/' + data.userName, {
                    area: $(window).width() <= 750 ? '95%' : '660px'
                });
            }
        });

        function getQueryParams() {
            return {
                tenantId: tenantId,
                roleName: $searchForm.find('input[name="roleName"]').val()?.trim(),
                status: '1'
            };
        }

        function valueExists(arrayList, fieldName, value) {
            let result = $.grep(arrayList, function (e) {
                return e[fieldName] == value;
            })
            return result && result.length > 0;
        }
    })
</script>